---
title: Neon Postgres & Astro
description: Neon을 사용하여 Astro 프로젝트에 서버리스 Postgres 데이터베이스를 추가하세요.
sidebar:
  label: Neon
type: backend
logo: neon
stub: false
i18nReady: true
---

import ReadMore from '~/components/ReadMore.astro';

[Neon](https://neon.tech)은 완전 관리형 서버리스 Postgres 데이터베이스입니다. 스토리지와 컴퓨팅을 분리하여 자동 확장, 브랜칭, 그리고 무제한 스토리지를 제공합니다.

## Astro 프로젝트에 Neon 추가하기

### 전제 조건 

- 생성된 프로젝트가 있는 [Neon](https://console.neon.tech/signup) 계정
- Neon 데이터베이스 연결 문자열
- [요청 시 렌더링 (SSR)](/ko/guides/on-demand-rendering/)이 활성화된 Astro 프로젝트

### 환경 구성

Astro에서 Neon을 사용하려면 Neon 환경 변수를 설정해야 합니다. 프로젝트 루트에서 `.env` 파일을 만들거나 편집하고 다음 코드를 추가하여 프로젝트 세부 정보를 대체합니다:

```ini title=".env"
NEON_DATABASE_URL="postgresql://<user>:<password>@<endpoint_hostname>.neon.tech:<port>/<dbname>?sslmode=require"
```

더 좋은 TypeScript 지원을 위해 `src/env.d.ts` 파일에 환경 변수를 정의하세요:

```typescript title="src/env.d.ts"
interface ImportMetaEnv {
  readonly NEON_DATABASE_URL: string;
}

interface ImportMeta {
  readonly env: ImportMetaEnv;
}
```

<ReadMore>Astro의 [환경 변수](/ko/guides/environment-variables/) 및 `.env` 파일에 대해 자세히 알아보세요.</ReadMore>

### 종속성 설치

Neon에 연결하려면 `@neondatabase/serverless` 패키지를 설치합니다:

```bash
npm install @neondatabase/serverless
```

### Neon 클라이언트 생성

다음 코드를 사용하여 새 파일 `src/lib/neon.ts`를 생성하여 Neon 클라이언트를 초기화합니다:

```typescript title="src/lib/neon.ts"
import { neon } from '@neondatabase/serverless';

export const sql = neon(import.meta.env.NEON_DATABASE_URL);
```

## Neon 데이터베이스 쿼리

이제 Neon 클라이언트를 사용하여 모든 `.astro` 컴포넌트에서 데이터베이스를 쿼리할 수 있습니다. 다음은 Postgres 데이터베이스에서 현재 시간을 가져오는 예시입니다:

```astro title="src/pages/index.astro"
---
import { sql } from '../lib/neon';

const response =  await  sql`SELECT NOW() as current_time`;
const currentTime = response[0].current_time;
---

<h1>Current Time</h1>
<p>The time is: {currentTime}</p>
```

## Neon을 사용한 데이터베이스 브랜칭

Neon의 브랜칭 기능을 사용하면 개발 또는 테스트를 위해 데이터베이스의 복사본을 만들 수 있습니다. 각 브랜치에 대해 서로 다른 환경 변수를 생성하여 Astro 프로젝트에서 이 기능을 사용하세요:

```ini title=".env.development"
NEON_DATABASE_URL=your_development_branch_url
```

```ini title=".env.production"
NEON_DATABASE_URL=your_production_branch_url
```

## 리소스

- [Neon 문서](https://neon.tech/docs/introduction)
- [Neon 서버리스 드라이버 GitHub](https://github.com/neondatabase/serverless)
- [Astro 사이트 또는 애플리케이션을 Neon Postgres에 연결](https://neon.tech/docs/guides/astro)
